<!doctype html>
<html lang="cmn">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!-- iOS -->
        <meta name="apple-mobile-web-app-title" content="Jiajun的编程随想">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-status-bar-style" content="#F8F9FA">
        <!-- Android -->
        <link rel="shortcut icon" href="/static/apple-touch-icon.png">
        <meta name="theme-color" content="#F8F9FA">
        {% block include_meta %}{% endblock %}

        <!-- Bootstrap CSS -->
        <link rel="apple-touch-icon" href="/static/apple-touch-icon.png">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" />
        {% block include_css %}{% endblock %}

        <title>
            {% if title %}{{ title }} - {% endif %}{% if subtitle %}{{ subtitle }} - {% endif %}Jiajun的编程随想
        </title>
        <style>
            img {
                max-width: 100%;
            }
            p {
                word-break: break-all;
            }
            a {
                word-break: break-all;
            }
            blockquote {
                background-color: #EEDFF9;
                margin-left: 1rem;
                padding: 0.5rem 0;
            }
            blockquote p {
                margin: 1rem;
            }
        </style>
        <!-- Global site tag (gtag.js) - Google Analytics -->
        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-79619009-1"></script>
        <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'UA-79619009-1');
        </script>
        <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
        <script>
            (adsbygoogle = window.adsbygoogle || []).push({
                google_ad_client: "ca-pub-6941340661228088",
                enable_page_level_ads: true
            });
        </script>
    </head>
    <body>
        <div class="container">
            <header class="mb-2">
                <nav class="navbar navbar-expand-lg navbar-light bg-light">
                    <a class="navbar-brand" href="/">Jiajun的编程随想</a>
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>

                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <form class="form-inline mr-auto" action="/search" method="POST">
                            <input class="form-control mr-sm-2" type="search" placeholder="搜索" name="search">
                            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">搜索</button>
                        </form>

                        <ul class="navbar-nav">
                            <li class="nav-item">
                                <a class="nav-link" href="/">首页</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="https://github.com/jiajunhuang/blog">Github</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/sharing">分享</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/notes">随想</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/projects">作品</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/friends">友链</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/aboutme">关于</a>
                            </li>
                        </ul>
                    </div>
                </nav>
            </header>

            <main role="main" class="container">
                <div id="body" class="row">
                    <div class="col-md-9">
                        {% block content %}{% endblock %}
                    </div>
                    <div class="col-md-3">
                        <div class="card mt-2">
                            <img src="/static/wechat.png" class="card-img-top" alt="微信二维码">
                            <div class="card-body">
                                <h5 class="card-title">微信交流群</h5>
                                <p class="card-text">高并发后端编程, 源码阅读, 技术分享(扫码加我入群)</p>
                            </div>
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item">
                                    <a href="https://t.me/jiajunhuangcom" class="card-link">
                                        <img src="">
                                        Telegram 订阅
                                    </a>
                                </li>
                                <li class="list-group-item">
                                    <a href="/rss" class="card-link">
                                        <img src="">
                                        RSS 订阅
                                    </a>
                                </li>
                                <li class="list-group-item">
                                    <a href="https://tools.jiajunhuang.com">
                                        <img src="">
                                        Kindle笔记导出
                                    </a>
                                </li>
                                <li class="list-group-item">
                                    <a href="/natproxy" class="card-link">
                                        <img src="">
                                        免费内网穿透
                                    </a>
                                </li>
                                <li class="list-group-item">
                                    <a href="https://jiajunhuang.com/tutorial/golang/index.md">
                                        <img src="">
                                        Golang 简明教程
                                    </a>
                                </li>
                                <li class="list-group-item">
                                    <a href="https://jiajunhuang.com/tutorial/python/index.md">
                                        <img src="">
                                        Python 教程
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <div class="card mt-2">
                            <img src="/static/reward.png" class="card-img-top" alt="微信和支付宝打赏二维码">
                            <div class="card-body">
                                <h5 class="card-title">微信|支付宝打赏💰</h5>
                                <p class="card-text">支持我继续创作</p>
                            </div>
                        </div>
                        <div class="card mt-2">
                            <div class="card-body">
                                <h5 class="card-title">标签</h5>
                                <span class="d-block">
                                    {% for word, count in get_words() %}
                                    <a href="/word?word={{ word }}" class="badge badge-light" style="font-size:0.8rem">{{ word }}({{ count }})</a>
                                    {% endfor %}
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </main>

            <footer class="footer mt-2 mb-2">
                <span class="text-muted">
                    <p><a href="https://github.com/jiajunhuang">@jiajunhuang</a> 2015-2019, All Rights Reserved。禁止转载。感谢Cloudflare提供免费服务。</a></p>
                </span>
            </footer>
        </div>

        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
        {% block include_js %}{% endblock %}
    </body>
</html>
